<template>
    <div class="wrapper">
        <el-row>
            <el-col :span="24">
                <common-card>
                    <template #header>
                        <div style="font-family: Roboto-Thin; padding: 20px; color: #fff">
                            <span style="font-size: 20px; display: inline-block; width: 100%">已选课题列表</span>

                            <span style="font-size: 14px; display: inline-block; width: 100%; margin-top: 10px">所有选题</span>
                        </div>
                    </template>

                    <template #main>
<!--                        <el-row style="margin-bottom: 15px" type="flex" align="middle">-->
<!--                            <el-input-->
<!--                                    clearable-->
<!--                                    size="mini"-->
<!--                                    @input="handlesearch"-->
<!--                                    class="tableSearch"-->
<!--                                    placeholder="课题名称"-->
<!--                                    prefix-icon="el-icon-search"-->
<!--                                    v-model="subjectName">-->
<!--                            </el-input>-->
<!--                            <el-input-->
<!--                                    clearable-->
<!--                                    size="mini"-->
<!--                                    @input="handlesearch"-->
<!--                                    class="tableSearch"-->
<!--                                    placeholder="教师姓名"-->
<!--                                    prefix-icon="el-icon-search"-->
<!--                                    v-model="teacherName">-->
<!--                            </el-input>-->

<!--                        </el-row>-->

                        <el-table
                                v-loading="tableLoading"
                                :max-height="height"
                                :data="tableData"
                                stripe
                                style="width: 100%">

                            <el-table-column
                                    prop="groupName"
                                    label="小组名称">
                            </el-table-column>

                            <el-table-column
                                    label="操作"
                                    width="180">
                                <template slot-scope="scope">
                                    <el-popover
                                            placement="left"
                                            width="1000"
                                            trigger="click">
                                        <el-button slot="reference" @click="getTaskInfo(scope.row)">小组课题详情</el-button>
                                        <el-table :data="gridData" @cell-click="copyClick">
                                            <el-table-column
                                                    width="150" property="taskname" label="课题名称">
                                            </el-table-column>
                                            <el-table-column
                                                    width="150" property="studentid" label="学号">
                                            </el-table-column>
                                            <el-table-column
                                                    width="100" property="studentname" label="学生姓名">
                                            </el-table-column>
                                            <el-table-column
                                                    width="200" property="codefilepath" label="代码文件">
                                            </el-table-column>
                                            <el-table-column
                                                    width="200" property="reportfilepath" label="报告文件">
                                            </el-table-column>
                                            <el-table-column
                                                    width="50" property="replayscore" label="答辩成绩">
                                            </el-table-column>
                                            <el-table-column
                                                    width="50" property="reportscore" label="报告成绩">
                                            </el-table-column>
                                            <el-table-column
                                                    width="50" property="finalscore" label="最终成绩">
                                            </el-table-column>
                                            <el-table-column
                                                    label="操作"
                                                    width="400"
                                                    >
                                                <template slot-scope="scope">
                                                    <el-tooltip class="item" effect="dark" content="修改答辩成绩" placement="top-start">
                                                        <el-button type="success" plain @click="editReplayScore(scope.row)" icon="el-icon-s-tools" circle >
                                                        </el-button>
                                                    </el-tooltip>
                                                    <el-tooltip class="item" effect="dark" content="修改报告成绩" placement="top-start">
                                                        <el-button type="success" plain @click="editReportScore(scope.row)" icon="el-icon-setting" circle >
                                                        </el-button>s
                                                    </el-tooltip>
                                                    <el-tooltip class="item" effect="dark" content="计算最终成绩" placement="top-start">
                                                        <el-button type="danger" plain @click="calculate(scope.row)" icon="el-icon-loading" circle >
                                                        </el-button>
                                                    </el-tooltip>

                                                    <el-tooltip class="item" effect="dark" content="下载学生代码文件" placement="top-start">
                                                        <el-button type="success" plain @click="getCodeUrl(scope.row)" icon="el-icon-notebook-1">
                                                            <el-link type="info" :underline="false" :href="'http://59.110.161.163:8088/task/download/code?taskid=' + codeUrl">Code</el-link>
                                                        </el-button>
                                                    </el-tooltip>
                                                    <el-tooltip class="item" effect="dark" content="下载学生报告文件" placement="top-start">
                                                        <el-button type="success" plain @click="getReportUrl(scope.row)" icon="el-icon-notebook-1">
                                                            <el-link type="info" :underline="false" :href="'http://59.110.161.163:8088/task/download/report?taskid=' + reportUrl">Report</el-link>
                                                        </el-button>
                                                    </el-tooltip>

                                                </template>
                                            </el-table-column>
                                        </el-table>
                                    </el-popover>
                                </template>
                            </el-table-column>
                        </el-table>
                    </template>
                </common-card>
            </el-col>
        </el-row>
        <add-dialog :dialog-visible="isAdd" :is-edit="isEdit" @closeDialog="isOpenDialog(false)"
                    :task-data="taskData" @fresh="fetchAllScore"/>
    </div>
</template>

<script>
    import CommonCard from '../../components/Cards/CommonCard';
    import addDialog from './addDialog'
    import * as scoreManage from '@/api/scoreManage';
    import Cookie from "js-cookie";


    export default {
        name: 'index',
        components: {
            CommonCard,
            addDialog
        },
        data() {
            return {
                total: 0,
                currentPage: 1,
                departmentData: {},
				subjectData: {},
                tableLoading: true,
                height: '',
                isAdd: false,
                isEdit: false,
                isStudent: false,
                tableData: [],
                userRes: {},
                teacherID: '',
                teacherusername: '',
                taskData: {},
                codeUrl: '111111',
                reportUrl: '1111',
                commitData: {
                    studentid: '',
                    teacherid: '',
                    subjectid: ''
                },
                gridData: []
            };

        },
        methods: {
            async fetchAllScore() {
                console.log(this.teacherid);
                try {
                    let resInfo = JSON.parse(Cookie.get("userInfo"));
                    console.log(resInfo);
                    if (resInfo.role === 2){
                        this.studentid = resInfo.token;
                    }else if (resInfo.role === 1){
                        console.log('teacherOK');
                        this.teacherusername = resInfo.token + "";
                        console.log(resInfo.token);
                        console.log(this.teacherusername);
                        const userRes = await scoreManage.getUserId(this.teacherusername);
                        this.teacherID = userRes.msg.userid;
                        console.log("CESHI"+this.teacherID);
                    }
                    this.tableLoading = true;
                    const res = await scoreManage.selectByTeacherID(this.teacherID);
                    console.log(res.msg);
                    this.tableData = res.msg;
                } catch (e) {
                    console.log(e)
                } finally {
                    this.tableLoading = false;
                }
            },
            isOpenDialog(isOpen, isEdit) {
                this.isAdd = isOpen;
                this.isEdit = isEdit;
            },

            async getTeacherInfo(){
                let resInfo = JSON.parse(Cookie.get("userInfo"));
                console.log(resInfo);
                if (resInfo.role === 2){
                    this.studentid = resInfo.token;
                }else if (resInfo.role === 1){
                    console.log('teacherOK');
                    this.teacherusername = resInfo.token + "";
                    console.log(resInfo.token);
                    console.log(this.teacherusername);
                    const userRes = await scoreManage.getUserId(this.teacherusername);
                    this.teacherID = userRes.msg.userid;
                    console.log(this.teacherID);
                }
            },
            async calculate(data){
                try {
                    console.log(data);
                    await scoreManage.calculateScore(data.scoreid);
                    this.fetchAllScore();
                    this.$notify({
                        title: '信息',
                        type: 'success',
                        message: '计算完成!'
                    });
                    this.handleFresh();
                    this.handleClose();
                    // this.getTaskInfo();
                }catch (e) {
                    console.log(e);
                    this.$notify({
                        title: '错误',
                        type: 'error',
                        message: '计算失败!'
                    });
                }finally {
                    this.loading = false
                }
            },
            async getTaskInfo(data){
                this.gridData = data.taskList;
                console.log(this.gridData);
            },

            async getCodeUrl(data){
                console.log("taskid"+data.taskid);
                this.codeUrl = data.taskid;
            },
            async getReportUrl(data){
                console.log("taskid"+data.taskid);
                this.reportUrl = data.taskid;
            },
            async editReplayScore(data) {
                try {
                    this.taskData = data;
                    this.isOpenDialog(true, false);
                } catch (e) {
                    console.log(e);
                }
            },
            async editReportScore(data) {
                try {
                    this.taskData = data;
                    this.isOpenDialog(true, true);
                } catch (e) {
                    console.log(e);
                }
            },
            handleClose() {
                this.$emit('closeDialog');
            },
            handleFresh() {
                this.$emit('fresh');
            },
            copyClick(row, column, cell, event) {
                this.$refs.popover4.showPopper = false;
                // document.body.click()
            }
        },
        created () {
            this.height = window.innerHeight - 150;
            this.getTeacherInfo();
            this.fetchAllScore();
        }
        }
</script>

<style scoped>
    .wrapper {
        padding: 0 15px;
    }

    .tableSearch {
        width: 221px;
    }

    .tableSearch >>> .el-input__inner {
        border-radius: 415px;
    }

    .btn {
        margin-right: 7px;
    }
</style>